<template>
  <div class="find">
    <main-tab-bar :newindex="newindex"></main-tab-bar>
    <setting-menu></setting-menu>
    <find-swiper :banners="banners" class="banners"></find-swiper>
    <find-recommand></find-recommand>
    <recommand :recommand-list="recommendList" :font_left="getContent"></recommand>
    <recommand :recommand-list="recommandSong" :font_left="getSongContent"></recommand>
    <recommand :recommand-list="actionRecommend" :font_left="getActionContent"></recommand>
    <recommand :recommand-list="radioRecommend" :font_left="getRadioContent"></recommand>
  </div>
</template>

<script>
  import MainTabBar from "../../components/content/maintabbar/MainTabBar";
  import FindSwiper from "./ChildFind/FindSwiper";
  import FindRecommand from "./ChildFind/FindRecommand";
  import Player from "../Player/Player";
  import Recommand from "../../components/content/Recommand/Recommand";
  import SettingMenu from "../../components/content/settingmenu/SettingMenu";

  import {getFindBanners, getRecommandList,
      getRecommandSong ,getActionRecommend,
      getRadioRecommend} from "../../network/findrequest";

  export default {
        name: "Find",
        components:{
            MainTabBar,
            Player,
            FindSwiper,
            FindRecommand,
            Recommand,
            SettingMenu
        },
        data(){
            return{
                newindex:1,
                banners: [],
                recommendList:[],
                recommandSong:[],
                actionRecommend:[],
                radioRecommend:[],
            }
        },
        methods:{

        },
      computed:{
          getContent(){
              return['推荐歌单','为你精挑细选']
          },
          getSongContent(){
              return ['风格推荐','你与民谣 我与欢喜']
          },
          getActionContent(){
              return ['场景推荐','午安 来杯音乐红茶']
          },
          getRadioContent(){
              return ['电台推荐','陌生人，送个故事给你']
          }
      },
        //一创建就开始请求数据
        created() {
            // 1.请求轮播图数据
          getFindBanners().then(res=>{
            this.banners = res.data.banners
          })
        //    2.请求推荐歌单数据
            getRecommandList().then(res=>{
                this.recommendList = res.data.result
            })
            getRecommandSong().then(res=>{
                // console.log(res.data.playlist.tracks)
                this.recommandSong = res.data.playlists
            })
            getActionRecommend().then(res=>{
                this.actionRecommend = res.data.playlists
            })
            getRadioRecommend().then(res=>{
                this.radioRecommend = res.data.djRadios
            })


        },
    }
</script>

<style scoped>
  .banners{
    padding-top: 44px;
  }

</style>